import { drawFn, onPointClick, initCanvas, drawPoints } from "../gui/draw";
import { getCurveFittingFn1, getCurveFittingFn2, getInterpolationFn } from "./polynomial";
import { getGaussInterpolationFn, getGaussCurveFittingFn } from "./gaussian";
import { IPoint } from "../models/gui";
import { getQuadSplineFn } from "./quadratic-spline";

const points: IPoint[] = [
  { x: 96, y: 156 },
  { x: 258, y: 210 },
  { x: 456, y: 204 },
  { x: 606, y: 216 },
  { x: 742, y: 284 },
  { x: 950, y: 294 },
  { x: 1076, y: 426 },
  { x: 1248, y: 408 },
  { x: 1294, y: 346 }
];

export function hw1 () {
  const canvas: HTMLCanvasElement = document.querySelector('#canvas');
  initCanvas(canvas);
  
  console.time();
  // const fn1 = getInterpolationFn(points); // 多项式插值
  // const fn2 = getCurveFittingFn1(points); // 多项式拟合 回归分析
  // const fn3 = getCurveFittingFn2(points); // 多项式拟合 岭回归
  const fn4 = getQuadSplineFn(points);
  console.timeEnd();

  // console.time();
  // const fn4 = getGaussInterpolationFn(points); // 高斯插值
  // const fn5 = getGaussCurveFittingFn(points); // 高斯拟合 岭回归
  // console.timeEnd();

  console.time();
  // drawFn(canvas, fn1, 'green');
  // drawFn(canvas, fn2, 'blue');
  // drawFn(canvas, fn3, 'brown');
  // drawFn(canvas, fn4, 'orange');
  drawFn(canvas, fn4, 'blue');
  console.timeEnd();

  drawPoints(canvas, points, 'red');

  // onPointClick(canvas, (p) => {
  //   drawPoints(canvas, [p], 'red');
  // });
}

